<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <script src="https://how2j.cn/study/js/jquery/2.0.0/jquery.min.js"></script>
    <link href="https://how2j.cn/study/css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
    <script src="https://how2j.cn/study/js/bootstrap/3.3.6/bootstrap.min.js"></script>
    <script src="https://how2j.cn/study/vue.min.js"></script>
    <script src="https://how2j.cn/study/axios.min.js"></script>
</head>
        <body>
        <div id="div1">
            <h1>{{data.title}}</h1>
            <div style="width: 300px">
                {{data.content}}
            </div>
        </div>
        </body>


        <script>

            function GetQueryString(name)
            {
                var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if(r!=null)return  unescape(r[2]); return null;
            }
            new Vue({
                el:'#div1',
                data:{
                    data:{}
                },
                mounted:function(){ //mounted　表示这个 Vue 对象加载成功了
                    var self = this
                    var id=GetQueryString("id");
                    axios.get("/common/newsDetails?id="+id).then(function(response) {
                        self.data= response.data; //此时还是字符串
                    })
                },
                methods:{

                }
            })

        </script>
</html>
